import React, { PureComponent } from 'react';
import { ExclamationCircleOutlined } from '@ant-design/icons';
import { message, Popconfirm } from 'antd';
import { AdvancedSearch, DATA_ENTRY, PrimaryC, TableC } from '../../../../comps';
import moment from 'moment';
import myStyle from './myStyle.less';
import { connect } from 'dva';

@connect(({ ValuationCheckM, loading, investmentAdviserReportM }) => ({ ValuationCheckM, loading, investmentAdviserReportM }))
export default class FundCheck extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      agreedData: [
        { title: '一致项', value: '0' },
        { title: '不一致项', value: '1' },
      ], // 是否一致下拉
      searchObj: {
        dataDt: moment().format('YYYY-MM-DD'),
        isAgreed: false,
      },
      currentPage: 1,
      numInPage: 10,
      total: 0,
      columns: [],
      dataSource: [],
      checkDisable: true, // 批量回溯和调平 是否置灰
      isReset: false, // 是否点击重置
      fundSelectedRows: [], //勾选的列
      selectedRowKeys: [], // 用来清除勾选项
      fundCode: undefined,
      tradingday: moment(),
    };
  }
  componentDidMount() {
    this.props.dispatch({
      type: 'investmentAdviserReportM/getTradingDay',
      payload: { type: '1' },
      callback: (data) => {
        this.setState(
          {
            tradingday: data,
            searchObj: { ...this.state.searchObj, dataDt: moment(data).format('YYYY-MM-DD') },
          },
          () => {
            this.getTableData();
          },
        );
      },
    });
  }
  // 查询表格数据
  getTableData = () => {
    const {
      ValuationCheckM: { fundColumns },
    } = this.props;
    const { searchObj, currentPage, numInPage } = this.state;
    this.props.dispatch({
      type: 'ValuationCheckM/getFundTableData',
      payload: {
        ...searchObj,
        userId: localStorage.getItem('antd-pro-userId'),
        page: currentPage,
        pageSize: numInPage,
      },
      callback: (type, data) => {
        if (type == 'success') {
          this.setState({
            columns: fundColumns,
            dataSource: data.dataSource,
            total: data.pageInfo && data.pageInfo.total,
            fundSelectedRows: [], //勾选的列
            selectedRowKeys: [],
            checkDisable: true,
          });
        } else {
          this.setState({
            columns: fundColumns,
            dataSource: [],
            total: 0,
          });
        }
      },
    });
  };
  //查询表格数据
  queryTableList = (e) => {
    let tempObj = {};
    for (let k in e) {
      if (k == 'dataDt') {
        tempObj[k] = e[k].format('YYYY-MM-DD');
      } else {
        tempObj[k] = e[k];
      }
      if (k == 'isAgreed') {
        if (e[k] == '0') {
          tempObj[k] = true;
        } else if (e[k] == '1') {
          tempObj[k] = false;
        }
      }
    }
    if (e && !e.dataDt) {
      tempObj.dataDt = null;
      message.warning('请选择查询日期!');
    } else {
      tempObj.fundCode = this.state.fundCode;
      this.setState(
        {
          searchObj: tempObj,
          isReset: false,
          currentPage: 1,
          // numInPage: 10,
        },
        () => {
          this.getTableData();
        },
      );
    }
  };
  //表格页码排序改变调用
  handleTableChange = (pagination) => {
    const { current, pageSize } = pagination;
    const { isReset } = this.state;
    if (isReset) {
      //判断是否点击了重置 点击页码不进行后台查询
      message.warning('查询条件已被重置，请重新查询。');
      return;
    }
    this.setState({
      currentPage: current,
      numInPage: pageSize,
    });
  };
  // 批量调平点击事件
  batchLevelClick = () => {
    this.props.dispatch({
      type: 'ValuationCheckM/batchLevel',
      payload: { data: this.state.fundSelectedRows },
      callback: (type) => {
        if (type == 'success') {
          this.setState(
            {
              checkDisable: true, // 批量回溯和调平 是否置灰
              currentPage: 1,
              // numInPage: 10,
            },
            () => {
              this.getTableData();
            },
          );
        }
      },
    });
  };
  // 批量回溯点击事件
  batchBackClick = () => {
    this.props.dispatch({
      type: 'ValuationCheckM/batchBack',
      payload: { data: this.state.fundSelectedRows },
      callback: (type) => {
        if (type == 'success') {
          this.setState(
            {
              checkDisable: true, // 批量回溯和调平 是否置灰
              currentPage: 1,
              // numInPage: 10,
            },
            () => {
              this.getTableData();
            },
          );
        }
      },
    });
  };
  render() {
    const { columns, dataSource, total, currentPage, numInPage } = this.state;
    const searchProps = {
      dataSource: [
        {
          dataIndex: 'dataDt',
          title: '日期',
          type: DATA_ENTRY.SINGLEDATE,
          initialValue: moment(this.state.tradingday),
          disableEnd: moment(this.state.tradingday).add(1, 'days'),
        },
        {
          dataIndex: 'isAgreed',
          title: '一致性',
          type: DATA_ENTRY.SELECT,
          dataSource: this.state.agreedData,
          allowClear: true,
          initialValue: '1',
        },
        {
          dataIndex: 'fundCode',
          title: '产品',
          type: DATA_ENTRY.PRODUCTLIST,
          allowClear: true,
          tradeModel: ['BOOKKEEPING_MODE', 'COMMAND_MODE'],
          verificationModeGZ: '0', //表示有估值
          onChange: (e) => {
            this.setState({ fundCode: e?.info.portfolioCode });
          },
        },
      ],
      //点击查询按钮
      onQuery: (e) => {
        this.queryTableList(e);
      },
      onClear: () => {
        //点击重置按钮
        this.setState({
          searchObj: {},
          isReset: true,
          fundCode: undefined,
        });
      },
    };
    const rowSelection = {
      selectedRowKeys: this.state.selectedRowKeys,
      onChange: (selectedRowKeys, selectedRows) => {
        if (selectedRowKeys && selectedRowKeys.length > 0) {
          this.setState({
            selectedRowKeys: selectedRowKeys,
            checkDisable: false,
          });
        } else {
          this.setState({
            selectedRowKeys: [],
            checkDisable: true,
          });
        }
        if (selectedRows && selectedRows.length > 0) {
          this.setState({
            fundSelectedRows: selectedRows,
            checkDisable: false,
          });
        } else {
          this.setState({
            fundSelectedRows: [],
            checkDisable: true,
          });
        }
      },
      getCheckboxProps: (record) => {
        let newdate = moment(this.state.tradingday).format('YYYYMMDD');
        let cousetitle = record.cousetitle.split('_')[1];
        if (record.dataDt != newdate || cousetitle == '无') {
          return { disabled: true };
        } else {
          return null;
        }
      },
    };
    return (
      <div>
        <div style={{ marginBottom: '10px' }}>
          <AdvancedSearch {...searchProps} />
        </div>
        <div>
          <Popconfirm title='只针对有差值的进行调平，确定调平？' icon={<ExclamationCircleOutlined className={myStyle.batchIcon} />} onConfirm={this.batchLevelClick}>
            <PrimaryC disabled={this.state.checkDisable} title={'批量调平'} style={{ margin: ' 0 4px 10px 0' }} />
          </Popconfirm>
          <Popconfirm title='只针对有差值的进行回溯，确定回溯？' icon={<ExclamationCircleOutlined className={myStyle.batchIcon} />} onConfirm={this.batchBackClick}>
            <PrimaryC disabled={this.state.checkDisable} title={'批量回溯'} style={{ margin: '0 0 10px 4px' }} />
          </Popconfirm>
        </div>

        <TableC
          columns={columns}
          loading={this.props.loading.effects['ValuationCheckM/getFundTableData'] == true}
          dataSource={dataSource}
          rowSelection={rowSelection}
          current={currentPage}
          total={total}
          pageSize={numInPage}
          rowKey='id'
          scroll={{ x: 'max-content' }}
          onChange={this.handleTableChange}
        />
      </div>
    );
  }
}
